<template>
  <div class="count">
    <!-- 组件中使用state数据1: 直接去实例上的$store中取值 -->
    <h2>Count组件:{{ $store.state.count }}</h2>
    <h2>Count组件:{{ count }}</h2>
  </div>
</template>

<script>
import { mapState } from "vuex";
export default {
  name: "Count",
  mounted() {
    const result = mapState(["count", "num"]);
    console.log(result, "r2esult");
  },
  computed: {
    count() {
      /* 组件中使用state数据2:可以书写一个计算属性,来拿到vuex中的数据,这样插值语法就比较简单，并且还有读取的缓存 */
      return this.$store.state.count;
    },
  },
};
</script>

<style scoped>
.count {
  background: pink;
}
</style>